remove site alias and locale from location.state.directedFrom path #1065

sandragolden · 2023-03-15T23:33:36Z

Description

Closes issue #1064

When testing a hybrid app between SFRA/SiteGenesis, certain pages are redirected to PWA. For account pages, if the shopper is not logged in, they are redirected back to the original page via location.state.directedFrom. When the pathname contains the site alias and locale (/RefArch/en-US/account/wishlist), the navigate(location.state.directedFrom) results in a 404 with duplicate site aliases and locales (/RefArch/en-US/RefArch/en-US/account/wishlist)

Types of Changes

Bug fix (non-breaking change that fixes an issue)
New feature (non-breaking change that adds functionality)
Documentation update
Breaking change (could cause existing functionality to not work as expected)
Other changes (non-breaking changes that does not fit any of the above)

Breaking changes include:

Removing a public function or component or prop

Adding a required argument to a function

Changing the data type of a function parameter or return value

Adding a new peer dependency to package.json

Changes

add new function (removeSiteLocaleFromPath) to packages/template-retail-react-app/app/utils/url.js that removes the site alias and locale from the pathName so that the navigate function works correctly
call removeSiteLocaleFromPath in packages/template-retail-react-app/app/pages/login/index.jsx to remove the site alias and locale from the path name so that the shopper is correctly redirected to previous page

How to Test-Drive This PR

Navigate directly to http://localhost:3000/RefArch/en-US/account/wishlist
Login
ensure you are correctly redirected to wishlist page

Checklists

General

Changes are covered by test cases
CHANGELOG.md updated with a short description of changes (not required for documentation updates)

Accessibility Compliance

You must check off all items in one of the follow two lists:

There are no changes to UI

or...

Changes were tested with a Screen Reader (iOS VoiceOver or Android Talkback) and had no issues
Changes comply with WCAG 2.0 guidelines levels A and AA
Changes to common UI patterns and interactions comply with WAI-ARIA best practices

Localization

Changes include a UI text update in the Retail React App (which requires translation)

packages/template-retail-react-app/app/pages/login/index.jsx

wjhsf · 2023-03-22T20:05:50Z

@sandragolden looks like this test is failing as a result of these changes, but I'm not sure why.

sandragolden · 2023-03-22T23:52:20Z

@sandragolden looks like this test is failing as a result of these changes, but I'm not sure why.

yeah thanks @wjhsf i saw it fail there on one test run and not on another even though the url matches exactly. 😕 i'll try to look at it again and see if i can get it to consistently fail and fix it

wjhsf · 2023-03-23T21:05:33Z

Looks like there are some changes to the test file in #1075. Let's hope that they might fix this issue! 🤞

wjhsf · 2023-03-24T19:52:39Z

packages/template-retail-react-app/app/pages/checkout/confirmation.test.js

+jest.mock('../../utils/url', () => {
+    return {
+        ...jest.requireActual('../../utils/url'),
+        removeSiteLocaleFromPath: jest.fn()
+    }
+})
+


Suggested change

jest.mock('../../utils/url', () => {

return {

...jest.requireActual('../../utils/url'),

removeSiteLocaleFromPath: jest.fn()

}

})

This makes the test pass, but it does so by not actually testing the code, so it doesn't really solve the problem. 😕

yes, i know. see same conversation here.

f8f4504#r105815160

the test is failing on the navigate back to the account page where removeSiteLocaleFromPath is called.

The chain ultimately goes:
removeSiteLocaleFromPath -> getParamsFromPath -> absoluteUrl -> getAppOrigin

which ultimately breaks here with TypeError: Cannot read properties of null (reading '_location')

const getAppOrigin = () => { if (typeof window !== 'undefined') { return window.location.origin; } ... }

no amount of mocking any of the above functions would work. if you console out the window.location.pathname in the test, you will see it's the same as what the test expects (expect(window.location.pathname).toEqual('/uk/en-GB/account')). I'm open to ideas. 🤷‍♀️

this is a minor bug that i'm trying to get in to support hybrid deployments and just trying to clear this failing test. I'll attempt more efforts later

Given the nature of the bug fix and the fact that all of our tests are super flaky (not just this one), I think it's fine if you just disable the broken one with test.skip for now, and we'll re-enable it once we've fixed our testing setup.

perfect, thanks @wjhsf, all set.

* Update `develop` with `release-v2.7.0` (#1033) * Starting release process for 2.7.0 * Update Create MRT credentials file (#1025) * Release 2.7: fix order of hooks (#1027) * Return early only after all of the hooks are called * Bumper version --------- Co-authored-by: Ben Chypak <[email protected]> * Quick fix for einstein data (#1028) * Quick fix for einstein data * Bump Version * Re-lock package-lock files with npm 8 * Update package-lock.json * Update einstein.js * Regenerate lock files (#1030) * Regenerate lock files * Bump version to 2.7.0-alpha.3 * Bump to 2.7.0 (#1032) * Begin development on 2.8.0 --------- Co-authored-by: Adam Raya <[email protected]> Co-authored-by: Vincent Marta <[email protected]> * Move the MRT reference app to the SDKs, so that we can verify eg. Node support (#966) * BUG: Changed type of the phone number field to bring up numberic keyboard on mobile devices - W-9871940 (#1016) Co-authored-by: Ben Chypak <[email protected]> * Update Retail React App Page Designer integration README (#1041) Co-authored-by: Richard Sexton <[email protected]> * Implement `updateCustomerPassword` as no-op. (#1031) * Allow query hook parameters to be `null`. (#1046) * Remove unused util. * Allow query hook parameters to be `null`. * Fix addresses not having preferred address first. (#1051) * Fix addresses not having preferred address first. * Include all addresses, not just preferred address twice. * Correctly include preferred address. * Make `mergeBasket` Conditional More Robust (#1048) * Update merge logic * Update CHANGELOG.md * Lint * PR feedback * Rename isNewlyRegisters to isNew for simplicity * Lint * [commerce-sdk-react] Decode pre-fetched token and save auth data in storage (#1052) * add test * decode jwt data * lint * Update packages/commerce-sdk-react/src/auth/index.ts Co-authored-by: Will Harney <[email protected]> * rename parseSlasJWT * Update packages/commerce-sdk-react/src/auth/index.test.ts Co-authored-by: Will Harney <[email protected]> * convert all .thens to await * make fake token in tests more clear * lint --------- Co-authored-by: Will Harney <[email protected]> * Prevent modal to open when it fails to add an item to cart (#1053) * prevent modal to open when it fails to add an item to cart * Update comment --------- Co-authored-by: Alex Vuong <[email protected]> * Fix `getConfig` referencing config from incorrect location (#1049) * Initial Commit * Update CHANGELOG.md * Revert some testing code * Get test coverage back up * Test build directory folder before proceeding. * fix(template-retail-react-app): product-list refinements (#957) * fix(template-retail-react-app): product-list refinements + Ensure that the `selectedFilters` provided to the `Refinements` value components is always an array. And update said value components (checkbox, color, radio & size) to handle always receiving an array. + Apply some loose equality checks, catering for cases where a refinement URL param is parsed as a number but the refinement `.value` is a stringified number. + Fix bug where non-multiple filters could not be unchecked by selecting themselves (e.g. clicking an already checked checkbox). + Fix bug where a refinement URL param is parsed as a number, but was handled as a string (with `.split()`). + Fix bug where radio refinements would still appear as checked after clearing the value via `SelectedRefinements`. + Deprecate unused proptypes in `SizeRefinements` * feat(retail-react-app): update `CheckboxRefinements` + Adjust the `onChange` logic so that multiple checkbox refinements can be selected --------- Co-authored-by: Ben Chypak <[email protected]> * update docs for shopper-experience scope (#1059) * add docs for experience scope * Add `merge_group` event to trigger GA builds --------- Co-authored-by: Will Harney <[email protected]> Co-authored-by: Adam Raya Navarro <[email protected]> * Update lockfiles to reflect current version. (#1071) * [commerce-sdk-react] Implement remaining Shopper Baskets cache logic (#1070) * Refactor Shopper Basket cache following new pattern * Fix types * Update packages/commerce-sdk-react/src/hooks/ShopperBaskets/cache.ts Co-authored-by: Will Harney <[email protected]> * PR Feedback * Clean up unused utils and types after refactor * Add missing response basketId to queryKey * Implement cache for the remaining mutations * Tests WIP * PR Feedback & Use query key path in `deleteBasket` cache * Add tests for mutations returning void response * PR Feedback * Remove unused `and` hooks util * Revert "Remove unused `and` hooks util" This reverts commit c0a364a. --------- Co-authored-by: Will Harney <[email protected]> * [commerce-sdk-react] Fix Shopper Baskets Test case (#1082) * Fix Shopper Basket empty response test cases * lint * feat(pwa-kit-dev): minor performance improvements and added comments (#974) * feat(pwa-kit-dev): minor performance improvements and added comments * docs(pwa-kit-dev): clean up comments * refactor(pwa-kit-dev): update condition from PR feedback --------- Co-authored-by: Will Harney <[email protected]> * Update dependencies. (#1079) * Remove internal packages to bypass lerna nonsense. Include output.json to make restoring deps easier. * Disable build scripts to make changing deps easier. * Update root deps. * Fix typescript issue. * Create restore script to restore internal deps/scripts. * Update commerce-sdk-react deps. * Update test-commerce-sdk-react deps. * Update template-typescript-minimal deps * Improve restore script. * Fix trailing comma. * Update template-retail-react-app deps * npm prune everything * Update pwa-kit-runtime deps * Update pwa-kit-react-sdk deps * Update pwa-kit-create-app deps * Update pwa-kit-dev deps (except eslint) * Update pwa-kit-dev eslint deps * Update internal-lib-build deps (except eslint) * Update pwa-kit eslint deps * Restore internal deps. * Restore build scripts. * Remove temporary helper files. * Bump ua-parser-js to avoid vulnerable version. * Anchor cross-env common dep to version used by internal-lib-build. * Re-enable eslint. * Implement Cache Logic for Shopper APIs (Contexts/Customers/Login/Orders) (#1073) * Initial commit * Update packages/commerce-sdk-react/src/hooks/useAuthHelper.ts Co-authored-by: Will Harney <[email protected]> * Update packages/commerce-sdk-react/src/hooks/ShopperOrders/cache.ts Co-authored-by: Will Harney <[email protected]> * Update packages/commerce-sdk-react/src/hooks/ShopperOrders/cache.ts Co-authored-by: Will Harney <[email protected]> * Added root to all query keys, use remove over clear * Remove previous impemented "clear" from utils * Initial tests for shoppercontexts * Update ShopperLogin tests * Fix order tests * Update packages/commerce-sdk-react/src/hooks/ShopperContexts/cache.ts Co-authored-by: Will Harney <[email protected]> * Update cache.ts * Lint! * Update Json.tsx * Lint! * Testing race condition in tests * Re-add tests in other order. * Update CHANGELOG.md * Add todo to complete context cache work * Update packages/commerce-sdk-react/src/hooks/ShopperBaskets/mutation.test.ts Co-authored-by: Will Harney <[email protected]> * Update packages/commerce-sdk-react/src/components/ShopperExperience/Page/index.tsx Co-authored-by: Will Harney <[email protected]> * Update useAuthHelper.ts * Update packages/commerce-sdk-react/src/hooks/ShopperCustomers/cache.ts Co-authored-by: Adam Raya <[email protected]> --------- Co-authored-by: Will Harney <[email protected]> Co-authored-by: Adam Raya <[email protected]> * remove site alias and locale from location.state.directedFrom path (#1065) * remove site alias and locale from location.state.directedFrom path * moving call to removeSiteLocaleFromPath into use-navigation hook * fixing failing test, added tests for removeSiteLocaleFromPath * per code review, skipping failed test instead of using mocking * Fix Page Designer ImageWithText Link component (#1092) * Fix PD ImageWithText Link component by using Chakra UI Link * Use isAbsoluteURL to use react-router Link or Chakra Link component * PR Feedback * Clean up * Update packages/template-retail-react-app/app/page-designer/assets/image-with-text/index.jsx Co-authored-by: Ben Chypak <[email protected]> * Remove temporal page-viewer page to facilitate review --------- Co-authored-by: Ben Chypak <[email protected]> * split ssr build on local (#1155) * add suffix to ssr build files (#1157) * Added session bridge call to login for phased launch (#1159) * Added session bridge call to login for phased launch * Fix code smell for session-bridge in hybrid * Fix multi-value query params being lost (#1150) * Fix multi-value query params being lost * Update CHANGELOG.md * Snyk dependency updates (#1169) * Dependency updates * Update runtime package lock * Bump cosmiconfig version to latest * [Hybrid] PWA Kit should have a mechanism for replacing the access token when a SFRA login state is changed (#1171) * Implement mechanism to store refresh token copy and compare with sfra * Update tests and mocks for util function to check SFRA login state * Fix linting issues * FIx param types for util functionn * Rename old isTokenValid to isTokenExpired * Remove expiry for refresh_token in localstorage * Update packages/template-retail-react-app/app/commerce-api/utils.js Co-authored-by: Kevin He <[email protected]> * fix test * Fix linting on use-auth-modal.test.js * Update hasSFRAStateChanged logic to compare keys and values * Fix linting --------- Co-authored-by: Kevin He <[email protected]> * Add a redirect to login page after user signs out from checkout page (#1172) * Add a redirect to login page after user signs out from checkout page * Update CHANGELOG.md * Remove history since navigate handles similarly * Bump version number to 2.7.1-alpha.0 * Update changelogs * #1174 Replace invalid value for wrap property (#1179) * Update changelogs * Version bump to 2.7.1-preview.0 * Revert "Version bump to 2.7.1-preview.0" This reverts commit 985a7e0. * Update CHANGELOG.md * Rebuild lock files and fix ShopperLogin mutation test * Revert "Rebuild lock files and fix ShopperLogin mutation test" This reverts commit d9cfe50. * Add additional properties to ShopperLogin test types (#1185) * [V2] Re-generate lock files and fix hook lib tests (#1186) * re-generate lock files and fix test * Update packages/commerce-sdk-react/src/hooks/ShopperBaskets/index.test.ts * Rebuild lockfiles using node 14 npm 8 * Revert "Rebuild lockfiles using node 14 npm 8" This reverts commit 3d5c0cb. * Use pwa-kit-dev for lint and format * Revert "Use pwa-kit-dev for lint and format" This reverts commit f46d83e. * Add typescript to internal-lib-build and rebuild lock files --------- Co-authored-by: vcua-mobify <[email protected]> Co-authored-by: vcua-mobify <[email protected]> * [V2] Internal lib build typescript dev dependency (#1194) * Move typescript to dev and peer dependency * Update package lock file * Lockfile updates --------- Co-authored-by: Ben Chypak <[email protected]> Co-authored-by: Adam Raya <[email protected]> Co-authored-by: Vincent Marta <[email protected]> Co-authored-by: Oliver Brook <[email protected]> Co-authored-by: echessman <[email protected]> Co-authored-by: John Boxall <[email protected]> Co-authored-by: Richard Sexton <[email protected]> Co-authored-by: Will Harney <[email protected]> Co-authored-by: Kevin He <[email protected]> Co-authored-by: Alex Vuong <[email protected]> Co-authored-by: Brad Adams <[email protected]> Co-authored-by: Charles Lavery <[email protected]> Co-authored-by: Adam Raya Navarro <[email protected]> Co-authored-by: ecRobertEngel <[email protected]> Co-authored-by: Sandra Golden <[email protected]> Co-authored-by: Jainam Sheth <[email protected]> Co-authored-by: mdenchev-aiopsgroup <[email protected]>

sandragolden requested a review from a team as a code owner March 15, 2023 23:33

sandragolden mentioned this pull request Mar 15, 2023

[BUG] redirects from hybrid SFCC site error when pathname includes site alias and locale #1064

Closed

wjhsf approved these changes Mar 17, 2023

View reviewed changes

bendvc reviewed Mar 17, 2023

View reviewed changes

packages/template-retail-react-app/app/pages/login/index.jsx Outdated Show resolved Hide resolved

sandragolden force-pushed the sgolden/fix-1064-remove-site-alias-locale branch from a75d49f to c8a3ff6 Compare March 18, 2023 08:04

sandragolden requested a review from bendvc March 18, 2023 08:06

wjhsf approved these changes Mar 20, 2023

View reviewed changes

bendvc approved these changes Mar 20, 2023

View reviewed changes

sandragolden force-pushed the sgolden/fix-1064-remove-site-alias-locale branch from f8f4504 to 732a5fe Compare March 23, 2023 23:26

sandragolden added 3 commits March 23, 2023 16:30

remove site alias and locale from location.state.directedFrom path

72f0e07

moving call to removeSiteLocaleFromPath into use-navigation hook

6bebe3c

fixing failing test, added tests for removeSiteLocaleFromPath

d3917b0

sandragolden force-pushed the sgolden/fix-1064-remove-site-alias-locale branch from 732a5fe to d3917b0 Compare March 23, 2023 23:30

wjhsf reviewed Mar 24, 2023

View reviewed changes

per code review, skipping failed test instead of using mocking

9559181

wjhsf added this pull request to the merge queue Mar 25, 2023

Merged via the queue into SalesforceCommerceCloud:develop with commit 6b9d436 Mar 25, 2023

vcua-mobify mentioned this pull request May 9, 2023

PWA Kit 2.7.1-alpha.0 release #1181

Merged

vcua-mobify mentioned this pull request May 11, 2023

[V2] PWA Kit Release 2.7.1 #1197

Merged

sandragolden deleted the sgolden/fix-1064-remove-site-alias-locale branch October 24, 2023 18:28

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

remove site alias and locale from location.state.directedFrom path #1065

remove site alias and locale from location.state.directedFrom path #1065

sandragolden commented Mar 15, 2023 •

edited

Loading

wjhsf commented Mar 22, 2023

sandragolden commented Mar 22, 2023

wjhsf commented Mar 23, 2023

wjhsf Mar 24, 2023

sandragolden Mar 24, 2023 •

edited

Loading

wjhsf Mar 24, 2023

sandragolden Mar 24, 2023

remove site alias and locale from location.state.directedFrom path #1065

remove site alias and locale from location.state.directedFrom path #1065

Conversation

sandragolden commented Mar 15, 2023 • edited Loading

Description

Types of Changes

Changes

How to Test-Drive This PR

Checklists

General

Accessibility Compliance

Localization

wjhsf commented Mar 22, 2023

sandragolden commented Mar 22, 2023

wjhsf commented Mar 23, 2023

wjhsf Mar 24, 2023

Choose a reason for hiding this comment

sandragolden Mar 24, 2023 • edited Loading

Choose a reason for hiding this comment

wjhsf Mar 24, 2023

Choose a reason for hiding this comment

sandragolden Mar 24, 2023

Choose a reason for hiding this comment

sandragolden commented Mar 15, 2023 •

edited

Loading

sandragolden Mar 24, 2023 •

edited

Loading